<template>
  <ve-cell :label="label">
    <view class="ve-cell-num" :style="{ textAlign: priceAlign }">
      <text class="result">{{ result }}</text> <text> {{ unit }}</text>
      <text v-if="addon">({{ addon }})</text>
    </view>
  </ve-cell>
</template>

<script>
  export default {
    props: {
      label: String,
      value: [String, Number],
      unit: {
        type: String,
        default: '',
      },
      addon: {
        type: String,
      },
      priceAlign: {
        type: String,
        default: 'left',
      },
      // date | time
      formate: String,
    },
    computed: {
      result() {
        if (this.value == undefined || this.value == null || this.value == '') {
          return '-'
        }
        if (this.formate) {
          if (this.formate == 'date') {
            return this.value.slice(0, 10)
          }
        }
        return this.value
      },
    },
  }
</script>

<style lang="scss" scoped>
  .ve-cell-num {
    font-size: 30rpx;
    font-weight: 400;
    line-height: 40rpx;
    width: 100%;
    .result {
      word-break: break-all;
    }
  }
</style>
